/* 
    Author     : webseo24h.com
    Description:
        Purpose of the stylesheet follows.
*/
/* Common */
body{font-size: 71%; font-family: arial,tahoma,"Times New Roman";background: #000000;}
a{color: #B2B1B1;}
a:hover{color: #FE0000;}
.left {text-align:left;}
.center {text-align:center;}
.right {text-align:right;}
.fleft {float:left;}
.fright {float:right;}
.bold {font-weight: bold;}
.red {color:#de1b2b;}
.green {color:green;}
.blue {color:blue;}
.white {color: #fff;}
.justify{text-align: justify;}
.no_border{border:none !important;}
input{margin: 0 2px; }
.read_more{text-decoration: none;color: #DE1B2B;}
.read_more:hover{text-decoration: underline;}

a:link, a:hover, button:hover{
    -moz-transition: all 0.1s ease-in-out 0s;
    -webkit-transition: all 0.1s ease-in-out 0s;
    transition: all 0.1s ease-in-out 0s;
}

.header_container,
.main_container,
.footer_container{
    font-size: 1.2em;
}
.right_side,
.block{color: #dddddd;}
.block .title{
    font-size: 1.4em;
    margin: 10px 0;	
}

.block label.title{
    font-size: 1.6em;
    margin: 10px 0;
	display: block;
}
.block label.title span{font-size: 14px;}

.side_item {float: left; margin-top: 20px;}
.side_item .categories li{font-size: 12px;float: left;margin-bottom: 10px;}
.side_item .categories li:hover > a {color:#FE0000;}
.side_item .categories li:hover > a {color:#FE0000;}
.side_item .categories li.selected > a  {color:#FE0000;}
.side_item .categories li a{
    color: #B2B1B1;
    text-decoration: none;
}

.side_item .categories .sub_categories {margin-top: 10px;}
.side_item .categories .sub_categories li {text-indent: 15px;}

/* Header */
.header_container{ margin-top: 15px; }
.header_content{border-bottom: solid 1px #ffffff;padding-bottom: 5px;}
.top_header{margin-bottom: 0px;}
.top_search{float: right;margin-top: 25px;margin-bottom: 9px;}
.top_search a{float: left;margin-right: 5px;}
.top_search form{display: inline;border: solid 1px #555555;padding: 5px;float: left;border-radius: 3px;}
.top_search input{overflow: hidden; font-size: 12px;}
#btn_search_form{background: url("../images/btn-search.png") no-repeat; width: 20px; border: none; cursor: pointer;}
.input_search{color: #999999; background: #000000; border: solid 1px #000000;}

/* Project */
.other_projects .project_item{margin-bottom: 1px;}
.projects {padding-top: 20px;}
.projects .project_item{margin: 0 5px 10px 0;}
.projects .project_item:nth-child(4n){margin-right: 0;}
.projects .project_item:nth-child(4n+1){margin-left: 0;}

.project_item a.postthumbnail{float: left; width: 200px; height: 158px;}
.project_item a.postthumbnail img{display: block; margin: auto; max-width: 200px; max-height: 158px;}
.project_item{
    float: left;
    width: 200px; 
    position: relative;
    height: 225px;
}

.project_item .view{
    position: absolute;
    top: 42%;left: 42%; 
    z-index: 88;opacity: 0;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}
.project_item .mask{
    /*position: absolute;top:0;left:0;
    float: left;width: 100%;height: 100%;
    background: url('../images/black_bg.png'); 
    z-index: 77;opacity: 0;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    */
	float: left; width: 100%; margin: 5px 0 0 0;
}

.project_item .mask2{
    position: absolute;top:0;left:0;
    float: left;width: 100%;height: 158px;
    background: url('../images/black_bg.png'); 
    z-index: 77;opacity: 0;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease; 
}
.project_item:hover .mask2{opacity:0.9;}
.project_item:hover a{color: #ff0000;}
.project_item .mask2 a{width: 100%; height: 100%; float: left;}
.project_item .mask2 img{width: auto!important; height: auto!important; display: block; margin: 60px auto auto;}

.project_item .mask a{ text-decoration: none; line-height: 18px;}
/*
.project_item  .sub_project_item:hover .mask{opacity: .9;}
.project_item .sub_project_item:hover .view{opacity: .9;}
.project_item a{text-decoration: none;}
.project_item .mask span{color: #969696;margin: 10px;position: absolute;bottom: 0;text-align: justify;line-height: 14px;}


.projects .project_highlight{margin: 0 1px 1px 0;}

.project_highlight{
    float: left;
    width: 272px; 
    position: relative;
    height: 210px;
}
.project_highlight .img{width: 272px;height: 210px;margin: 0;}
.project_highlight .mask{
    position: absolute;
    bottom:  0;
    right: 0;
    padding: 10px;
    color: #bbb;
    background: url('../images/black_bg.png');
    font-size: 13px;
    width: 252px;
    
/*    height: 100
    position: absolute;top:0;left:0;
    float: left;width: 100%;height: 100%;
    background: url('../images/black_bg.png'); 
    z-index: 77;opacity: 0;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;*/
}
/*.project_highlight:hover .mask{opacity: .9;}*/
/*.project_highlight a{text-decoration: none;}*/
/*.project_highlight .mask span{color: #969696;margin: 10px;position: absolute;bottom: 0;text-align: justify;line-height: 14px;}*/

.project_detail{ color: #bbb;}

/*Pagination*/
.pagination{margin: 10px 0 20px 0px;font-weight: bold;float: right;font-size: .8em; width: 100%;}
.pagination strong{color: #f3f3f3;border: solid 1px #d6d3d0;}
.pagination a{color: rgb(145, 145, 145);border: solid 1px rgb(131, 130, 130);}
.pagination a:hover{color: #f3f3f3;border: solid 1px #d6d3d0;}
.pagination span{color: #f3f3f3;border: solid 1px #d6d3d0; padding: 5px 10px;}
.pagination a,.pagination strong{padding: 5px 10px;text-decoration: none;margin: 2px;}

/* MENUS */
.menus_container{background: #1a4885;float: left; width: 100%;}
.main_menus {font-size: 1.1em;color: #b2b1b1;}
.menus{}
.menus a {color: #eee; text-decoration: none;}
.menus li { display: inline; position: relative; float: left; font-size: 12px;}
.menus li a{ text-transform: uppercase;padding: 12px 15px;float: left;font-weight: bold;}
.menus li:last-child a{ padding-right: 0;}
.menus li:hover a{ opacity: .95;}
.menus li:hover a,.menus .active a,.current_page_item a{ color: #fe0000; }
.menus li:hover .sub-menu{ display: block;}
.menus li .sub-menu{ left: 0;top: 36px;}
.sub-menu{ display: none; position: absolute; width: 180px; z-index: 1000;background: #222222; opacity: .95;}
.sub-menu li a{ float: left; width: 83%; color: #fff!important; text-transform: none;}
.sub-menu li .sub-menu{ margin-left: 180px; margin-top: -37px;}
.sub-menu li{border-bottom: solid 1px #111111;line-height: 16px; width: 100%;}
li.has_child a{background: url('../images/arrow-menu.png') no-repeat right 5px top 14px;}
.sub-menu li:hover{ background-color: #101010; }
.sub-menu li:hover a{color: #FE0000!important;}
.sub-menu li.active a {color: #fe0000;}

#main_img a{float: left;width: 100%;}
#main_img img{width: 100%;height: 386px;}
.hp_slideshow { overflow: hidden;}
.slide_images{position: relative;float: left;width: 100%;margin-top: 1px;}
.list_img li{ float: left; }
.list_img li a{float: left;width: 100%;}
.list_img li img{width: 108px;margin: auto;height: 43px;}

.jcarousel-next,
.jcarousel-prev{
    position: absolute;
    opacity: .4;
    filter:alpha(opacity=40);
    cursor: pointer;
    transition: all ease-in .2s;
}
.jcarousel-next:hover,
.jcarousel-prev:hover{
    opacity: .9;
    filter:alpha(opacity=90);
}
.hp_slideshow .jcarousel-next{
    background: url('../images/btn_next.png') no-repeat;
    right: 0px; top:0;
    float: left;
    width: 20px;
    height: 45px;
}
.hp_slideshow .jcarousel-prev{
    background: url('../images/btn_prev.png') no-repeat;
    left: 0px; top:0;
    float: left;
    width: 20px;
    height: 45px;
}

.hp_slideshow .jcarousel-clip {
    width: 990px;
}

/*Breadcrumbs*/
.breadcrumbs{
    width: 100%;
    padding: 7px 0;
    color: #B2B1B1;
}
.breadcrumbs a{
    text-decoration: none;
    color: #eee;
}
.breadcrumbs li:last-child a,
.breadcrumbs li a:hover{
    color: #de1b2b;
}
.breadcrumbs li{
    display: inline;    
}

.news_detail .content_detail{ color: #ddd;}
.content_detail {line-height: 20px;}
.content_detail p { margin: 10px 0;line-height: 20px;}
.content_detail a { text-decoration: underline;color: #ff0000;}
.content_detail a:hover {text-decoration: none;}
.content_detail h1 {font-size: 1.6em;margin: 8px 0;}
.content_detail h2 {font-size: 1.4em;margin: 6px 0;}
.content_detail h3 {font-size: 1.2em;margin: 4px 0; text-transform: uppercase;}
.content_detail h3.underline {border-bottom: 1px solid #777; padding-bottom: 5px; }
.content_detail h4 {margin: 2px 0;}
.content_detail ul {list-style: disc outside none;margin-left: 25px;padding: 5px 0;}
.content_detail li {}
.content_detail ol {list-style: decimal outside none;margin-left: 25px;padding: 5px 0;}
.content_detail img.lazy {display: block!important; margin: auto!important; max-width: 770px;}
/*.news_detail .content_detail img{width: 90%;}*/

/* News */
.news {overflow: hidden;}
.news li:first-child{border-top: none;}
.news li {float: left; width: 100%;padding:10px 0; line-height: 16px; color: #333333; border-top: 1px dashed #333;}
.news li a.title {font-size: 1.1em;text-decoration: none; color: #eee;}
.news li a.title:hover{text-decoration: underline;}
.news li p{margin-top: 5px;color: #bbb;line-height: 20px;}
.news li a.postthumbnail{
	float: left; 
    height: 90px;
    width: 120px;
    margin-right: 15px;	
	margin-right: 10px;}
.news li img{   
    max-height: 90px;max-width: 120px;
    margin-right: 15px;	
	margin-right: 10px;
	display: block; margin: auto;
}
.news li span{margin-left: 5px;color: #777;}
.news li .read_more{text-decoration: none; font-weight: bold;color: rgb(204, 65, 65);font-size: .9em; background: url('../images/readmore1.png') no-repeat right 3px;padding-right: 12px;float: right;}
.news li .read_more:hover{color: rgb(255, 0, 0);}

.other_news{color: rgb(194, 194, 194);float: left; width: 100%}
.other_news li{padding: 7px 0;line-height: 20px;border-bottom: 1px solid #222222;}
.other_news li:last-child{border:none !important;}
.other_news li a{color: rgb(209, 209, 209); text-decoration: none;}
.other_news li a:hover{color: #eee;}
.other_news li span{margin-left: 5px;}

.news_detail{margin-top: 10px;margin-bottom: 30px;overflow: hidden;}
.news_detail > .title{color: #ddd;font-size: 1.5em;}
.news_date {
    color: #999999;
    float: left;
    width: 100%;
    margin:0px 0px 10px 0;
    line-height: 30px;
}
.related_post{ margin-bottom: 10px; margin-top: 10px; float: left;}
.related_post strong { font-size: 1.1em; color: #888; }
.related_post ul { margin-left: 15px; margin-top: 10px;}
.related_post ul li a{ text-decoration: none; color: #888; }
.related_post ul li:hover a{ color: #fff;}
.related_post ul li:hover{color: #bbb;-moz-transition: all 0.4s ease-in-out 0s;
                          -webkit-transition: all 0.4s ease-in-out 0s;
                          transition: all 0.4s ease-in-out 0s;}
.related_post ul li{ line-height: 20px; color: #555;list-style: circle;}

/*TABLE*/
.table td,
.table th{
    padding: 5px;
}

/*FORM*/
.form textarea { font-size: 1em; }
.form td span { color: red; }
.form select, .form textarea, .form input[type="password"], .form input[type="radio"], .form input[type="checkbox"], .form input[type="text"] {
    padding: 5px;
    border: solid 1px #303030; 
    background: #0e0e0e; 
    color: #ddd;
}
.form textarea { font-size: 13px; }
.message {
    border: 1px solid #555555;
    margin: 10px 0px 10px 5px;
    padding: 8px;
    display: block;
    float: left;
    min-width: 450px;
    color: #333333;
}
.message p{ line-height: 16px; }
.message.error { background: none repeat scroll 0 0 #FFFF99; }
.message.succeed { background: none repeat scroll 0 0 #CCFF33; }
.message strong { color: #D70000; }
.input_button { border: 1px solid #333333;}
.input_button:hover {
    background: none repeat scroll 0 0 #888888;
    border: 1px solid #222222;
    color: #eeeeee;
}
.input_button, a.button {
    float: left;
    padding: 5px 10px;
    text-decoration: none;
    cursor: pointer;
    border: solid 1px #303030; 
    background: #101010; 
    color: #555;
    font-weight: bold;
}
.input_button:hover, a.button:hover{
    border: solid 1px #777; 
    background: #333; 
    color: #999;
}

.contact_form{width: 50%;}
.gmap{width: 50%;}
.gmap iframe{width: 100%; min-height: 300px;}

/* Footer */
.footer_content { padding: 20px 0; color: #bbb; border-top: solid 1px #777;margin-top: 20px;}
.bottom_footer .content_detail p{margin: 5px 0;}
.footer_content p{ margin: 8px 0;}
.footer_content a{ color: #bbb; text-decoration: none;}
.footer_content a:hover{text-decoration: none; color: #ff0000;}
.bottom_footer{color: #bbb;float: left; width: 100%;border-top: solid 1px #0e0e0e; padding-top: 5px;height: 45px;}
.bottom_footer a{ text-decoration: none;}
.footer_content li {
    padding: 1px 0;
}

.feedback div {
    border-bottom: solid 1px #777;
    padding: 5px 0;
}
.feedback div:last-child{border: none;}
.feedback p {
    line-height: 20px;
}
.send_testimonial {}

.feedback{}
.feedback .customer,p.customer{font-weight: bold;color: rgb(145, 143, 143);font-size: 10px;}
.feedback .content{font-style: italic; color: #c2c2c2;}
#back-top {
    bottom: 30px;
    position: fixed;
    right: 50px;
    z-index: 9999;
    cursor: pointer;
    opacity: .4;
}
#back-top:hover{opacity: .75;}
#back-top span {
    background: url("../images/scroll.png") no-repeat scroll left 0 transparent;
    display: block;
    height: 46px;
    width: 46px;
}
.tags a{
    color: #c2c2c2;
    line-height: 20px;
}

.current-cat a{color: #ff0000!important;}

/************ Widget *********/
.widget .sidebar-item{margin: 20px 0 10px 0; float: left; width: 100%; }

.widget .sidebar-item label {
	font-weight: bold;
}

.widget ul{}
.widget ul li{margin:0; float: left; width: 100%; border-bottom: 1px solid #222222; padding: 5px;}
.widget ul li a{line-height: 20px; font-size: 13px; text-decoration: none;}
.tagcloud a{font-size: 12px;}




/**** Comment ****/
.product-detail-comment-onlocal{float: left; width: 99%; margin-top: 10px;}
#commentform{}
#commentform p{display: block; margin: 5px 0;}
#comment{width: 80%;}


/*** show error***/
.show-error{border-color: #ff0000!important;}
.text_error{color: #ff0000;}